<template>
	<view>
		<nav-custom :name="title"></nav-custom>
		<view class="list">
			<view class="back bor_bot">
				<view class="dis_f_sb_c bor_bot">
					<view class="black_s_28">商品名称</view>
					<view class="list_bo">
						<u--input placeholder="请填写商品名称" fontSize="14" border="none" v-model="value"
							></u--input>
					</view>
				</view>
				<!-- <view class="dis_f_sb_c">
					<view class="black_s_28">商品类型</view>
					<view class="list_bo dis_f_r_c" @click="fl_show = true">
						<view class="black_f_28">
							{{fl_name}}
						</view>
						<image class="r_img" src="../../static/image/right.png" mode=""></image>
					</view>
				</view> -->
			</view>
			<view class="back dis_f_sb_t bor_bot">
				<view class="black_s_28">商品图片</view>
				<view class="list_b">
					<u-upload
							:fileList="fileList1"
							@afterRead="afterRead"
							@delete="deletePic"
							name="1"
							multiple
							:maxCount="6"
						></u-upload>
					
					
					
					
					
					<!-- <view class=" black_s_28" v-if="is_show" @click="chooseImg">
						<image class="b_add" src="../../static/image/add.png" mode=""></image>
					</view>
					<view class="b_add_img" v-if="!is_show">
						<view class="shanchu" @click="delet()">
							<image class="delet" src="../../static/image/shanchu.png" mode=""></image>
						</view>
					</view>
					<view class="grey_f_20">建议上传尺寸为1:1的图片</view> -->
				</view>
			</view>
			<view class="back bor_bot">
				<view class="dis_f_sb_t bor_b_bot">
					<view class="black_s_28">商品规格</view>
					<view class="blue_f_28" @click="show = true">
						+添加一级规格
					</view>
				</view>
				<view class="add_one">
					<view v-for="(item,index) in spec">
						<view class="yiji white_f_28 dis_f_sb_c">
							<view>{{item.name}}</view>
							<view class="but_img dis_f_sb_c">
								<image class="is_img" @click="yi_tianjia(index)" :src="url+'/image/addlist.png'" mode="">
								</image>
								<image class="is_img" @click="yi_bianji(item,index)" :src="url+'/image/bianji.png'" mode=""></image>
								<image class="is_img" @click="yi_del(index)" :src="url+'/image/baishanchu.png'"
									mode=""></image>
								<image class="is_img" v-if="item.is_show" @click="guan(index,0,1)" :src="url+'/image/top.png'" mode=""></image>
								<image class="is_img" v-else  @click="kai(index,0,1)" :src="url+'/image/bottom.png'" mode=""></image>
							</view>
						</view>
						<view v-if="item.is_show" v-for="(items,indexs) in item.ch">
							<view class="erji white_f_28 dis_f_sb_c" >
								<view>{{items.specification}}</view>
								<view  class="but_img2 dis_f_sb_c">
									<image class="is_img" @click="er_bianji(items,indexs)" :src="url+'/image/bianji.png'" mode=""></image>
									<image class="is_img" @click="er_del(index,indexs)" :src="url+'/image/baishanchu.png'"
										mode=""></image>
									<image class="is_img" v-if="items.is_show" @click="guan(index,indexs,2)" :src="url+'/image/top.png'" mode=""></image>
									<image class="is_img" v-else @click="kai(index,indexs,2)" :src="url+'/image/bottom.png'" mode=""></image>
								</view>
							</view>
							<view class="er_zk" v-if="items.is_show">
								<view class="er_list black_s_28">
									<view class="dis_f_l_c bor_b_bot">
										<view class="mar_r_48">商品价格</view>
										<view>￥{{items.money}}</view>
									</view>
									<view class="dis_f_l_c bor_b_bot">
										<view class="mar_r_48">商品库存</view>
										<view>{{items.num}}</view>
									</view>
									<!-- <view class="dis_f">
										<view class="mar_r_48">规格图片</view>
										<view>
											<image class="er_img" :src="items.pic_image" mode=""></image>
										</view>
									</view> -->
								</view>
							</view>
						</view>
						
					</view>
				</view>
			</view>
			<view class="back bor_bot">
			<!-- 	<view class="dis_f_sb_c bor_bot">
					<view class="black_s_28">销售价格</view>
					<view class="list_bo dis_f_r_c">
						<u--input placeholder="请填写销售价格" fontSize="14" border="none" v-model="value1"
							></u--input>
						<view class="black_s_28">
							元
						</view>
					</view>
				</view>
				<view class="dis_f_sb_c bor_bot">
					<view class="black_s_28">商品库存</view>
					<view class="list_bo">
						<u--input placeholder="请填写商品库存" fontSize="14" border="none" v-model="value3"
							></u--input>
					</view>
				</view> -->
				<view class="dis_f_sb_c">
					<view class="black_s_28">商品状态</view>
					<view class="list_bo dis_f_r_c" @click="zt_show = true">
						<view class="black_f_28">
							{{zt_name}}
						</view>
						<image class="r_img" :src="url+'/image/right.png'" mode=""></image>
					</view>
				</view>
			</view>
			<!-- <view class="back dis_f_sb_t bor_bot">
				<view class="black_s_28">七天无理由</view>
				<view>
					<u-checkbox-group placement="column" @change="checkboxChange">
						<u-checkbox shape="circle" :checked="checked"></u-checkbox>
					</u-checkbox-group>
				</view>
			</view> -->
			<view class="back dis_f_sb_t bor_bot">
				<view class="black_s_28">商品详情</view>
				<view class="list_b">
					<u-upload
							:fileList="fileList2"
							@afterRead="afterRead"
							@delete="deletePic"
							name="2"
							multiple
							:maxCount="9"
						></u-upload>
					
					
					
					<!-- <view class=" black_s_28" v-if="is_show" @click="chooseImg">
						<image class="b_add" src="../../static/image/add.png" mode=""></image>
					</view>
					<view class="b_add_img" v-if="!is_show">
						<view class="shanchu" @click="delet()">
							<image class="delet" src="../../static/image/shanchu.png" mode=""></image>
						</view>
					</view>
					<view class="grey_f_20">建议上传3M内的图片</view> -->
				</view>
			</view>
		</view>
		<view class="bule_back_but white_f_32" style="margin-left: 32rpx;" @click="submit">
			保存
		</view>
		<!-- <image class="bo_js_er_img" src="../../static/image/zcxian.png" mode=""></image> -->
		<view>
			<u-popup :show="show" mode="center" :round="10" @close="close">
				<view class="tc">
					<view class="black_f_32 font_w_bold dis_f_c_c bor_b_48">一级规格</view>
					<view class="grey_h_28 bor_b_48">
						<view class="mar_b_8">规格名称</view>
						<view class="tc_input">
							<u--input placeholder="请填写一级规格名称" border="none" v-model="tcvalue"
								></u--input>
						</view>
					</view>
					<view class="dis_f_c_c">
						<view class="but_a black_s_32 font_w_bold" @click="close()">取消</view>
						<view class="but_b white_f_32 font_w_bold mar_l_24" @click="spec_sub()">确定</view>
					</view>
				</view>
			</u-popup>
		</view>
		
		
		<u-popup :show="yi_edit_show" mode="center" :round="10" @close="yi_edit_close">
			<view class="tc">
				<view class="black_f_32 font_w_bold dis_f_c_c bor_b_48">一级规格</view>
				<view class="grey_h_28 bor_b_48">
					<view class="mar_b_8">规格名称</view>
					<view class="tc_input">
						<u--input placeholder="请填写一级规格名称" border="none" v-model="yi_item.name"
							></u--input>
					</view>
				</view>
				<view class="dis_f_c_c">
					<view class="but_a black_s_32 font_w_bold" @click="yi_edit_close()">取消</view>
					<view class="but_b white_f_32 font_w_bold mar_l_24" @click="spec_edit()">确定</view>
				</view>
			</view>
		</u-popup>
		<view>
			<u-popup :show="sc_show" mode="center" :round="10" @close="sc_close">
				<view class="tc">
					<view class="black_f_32 font_w_bold dis_f_c_c bor_b_48">一级规格</view>
					<view class="grey_h_32 dis_f_c bor_b_48">
						确认删除这条规格？
					</view>
					<view class="dis_f_c_c">
						<view class="but_a black_s_32 font_w_bold" @click="sc_close()">取消</view>
						<view class="but_b white_f_32 font_w_bold mar_l_24" @click="spec_del()">确定</view>
					</view>
				</view>
			</u-popup>
		</view>
		
		
		
		
		
		
		<view>
			<u-popup :show="ershow" mode="center" :round="10" @close="erclose">
				<view class="tc">
					<view class="black_f_32 font_w_bold dis_f_c_c bor_b_48">添加二级规格</view>
					<view class="">
						<view class="dis_f_sb_c bor_b_48">
							<view class="black_s_28">规格名称</view>
							<view class="list_bo dis_f_r_c">
								<u--input placeholder="请填写二级规格名称" fontSize="14" border="none" v-model="valueer"
									></u--input>
							</view>
						</view>
						<view class="dis_f_sb_c bor_b_48">
							<view class="black_s_28">销售价格</view>
							<view class="list_bo dis_f_r_c">
								<u--input placeholder="请填写销售价格" fontSize="14" border="none" v-model="valueer1"
									></u--input>
								<view class="black_s_28">元</view>
							</view>
						</view>
						<view class="dis_f_sb_c bor_b_48">
							<view class="black_s_28">商品库存</view>
							<view class="list_bo dis_f_r_c">
								<u--input placeholder="请填写商品库存" fontSize="14" border="none" v-model="valueer2"
									></u--input>
							</view>
						</view>
						<!-- <view class="dis_f_sb_t bor_b_48">
							<view class="black_s_28">规格图片</view>
							<view class="list_bo" v-if="img_show">
								<image class="addimg mar_b_8" @click="addImg()" src="../../static/image/add.png"
									mode=""></image>
								<view class="grey_f_20">
									建议上传尺寸为1:1的图片
								</view>
							</view>
							<view class="list_bo" v-if="!img_show">
								<view class="list_b_bo">
									<image class="addimg" :src="Image" mode="" @click="addImg()"></image>
								
								</view>
							</view>
						</view> -->
					</view>
					<view class="dis_f_c_c">
						<view class="but_a black_s_32 font_w_bold" @click="erclose()">取消</view>
						<view class="but_b white_f_32 font_w_bold mar_l_24" @click="spec_er_sub()">确定</view>
					</view>
				</view>
			</u-popup>
		</view>
		
		
		
		<u-popup :show="er_edit_show" mode="center" :round="10" @close="erclose">
			<view class="tc">
				<view class="black_f_32 font_w_bold dis_f_c_c bor_b_48">添加二级规格</view>
				<view class="">
					<view class="dis_f_sb_c bor_b_48">
						<view class="black_s_28">规格名称</view>
						<view class="list_bo dis_f_r_c">
							<u--input placeholder="请填写二级规格名称" fontSize="14" border="none" v-model="er_item.specification"
								></u--input>
						</view>
					</view>
					<view class="dis_f_sb_c bor_b_48">
						<view class="black_s_28">销售价格</view>
						<view class="list_bo dis_f_r_c">
							<u--input placeholder="请填写销售价格" fontSize="14" border="none" v-model="er_item.money"
								></u--input>
							<view class="black_s_28">元</view>
						</view>
					</view>
					<view class="dis_f_sb_c bor_b_48">
						<view class="black_s_28">商品库存</view>
						<view class="list_bo dis_f_r_c">
							<u--input placeholder="请填写商品库存" fontSize="14" border="none" v-model="er_item.num"
								></u--input>
						</view>
					</view>
					<!-- <view class="dis_f_sb_t bor_b_48">
						<view class="black_s_28">规格图片</view>
						<view class="list_bo" v-if="img_show">
							<image class="addimg mar_b_8" @click="addImg()" src="../../static/image/add.png"
								mode=""></image>
							<view class="grey_f_20">
								建议上传尺寸为1:1的图片
							</view>
						</view>
						<view class="list_bo" >
							<view class="list_b_bo">
								<image class="addimg" :src="Image" mode="" @click="addImg()"></image>
								
							</view>
						</view>
					</view> -->
				</view>
				<view class="dis_f_c_c">
					<view class="but_a black_s_32 font_w_bold" @click="erclose()">取消</view>
					<view class="but_b white_f_32 font_w_bold mar_l_24" @click="spec_er_edit()">确定</view>
				</view>
			</view>
		</u-popup>
		
		
		
		
		
		
		
		
		
		
		
		
		
		<view>
			<u-popup :show="scer_show" mode="center" :round="10" @close="scer_close">
				<view class="tc">
					<view class="black_f_32 font_w_bold dis_f_c_c bor_b_48">二级规格</view>
					<view class="grey_h_32 dis_f_c bor_b_48">
						确认删除这条规格？
					</view>
					<view class="dis_f_c_c">
						<view class="but_a black_s_32 font_w_bold" @click="scer_close()">取消</view>
						<view class="but_b white_f_32 font_w_bold mar_l_24" @click="spec_er_del()">确定</view>
					</view>
				</view>
			</u-popup>
		</view>
		
		
		
		
		
		
		
		
		
		<view>
			<u-picker :show="fl_show" @confirm="confirm" @cancel="cancel" :columns="columns" keyName="name"></u-picker>
		</view>
		<view>
			<u-picker :show="zt_show" @confirm="zt_confirm" @cancel="zt_cancel" :columns="zt_columns" keyName="name"></u-picker>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				checked:false,
				title: "添加商品",
				value: '',
				value1: '',
				value2: '',
				value3: '',
				value4: '',
				valueer: '',
				valueer1: '',
				valueer2: '',
				tcvalue: '',
				is_show: true,
				Urlimg: '',
				show: false,
				ershow: false,
				one_show: false,
				two_show: false,
				sc_show: false,
				scer_show: false,
				oneName: "一级规格名称",
				twoNameL: "二级规格名称",
				jiage: "150.25",
				guige: 120,
				Image: [],
				img_show: true,
				id:0,
				info:[],
				fl_show: false,
				columns: [
					// ['微信', '建设银行(6648)', '建设银行(6648)', '农业银行(6648)', '工商银行(6648)']
				],
				fl_name:'请选择分类',
				fl_id:0,
				zt_show: false,
				zt_columns: [
					[
						{
							value:1,
							name:'上架',
						},
						{
							value:0,
							name:'下架',
						},
					]
				],
				zt_name:'请选择状态',
				is_on_sale:-1,
				spec:[],
				yi_index:-1,
				er_index:-1,
				yi_item:{},
				er_item:{},
				yi_edit_show:false,
				er_edit_show:false,
				is_submit:0,
				fileList1:[],
				fileList2:[],
				is_seven_days:0,
				url:''
			}
		},
		onLoad(e) {
			this.url=this.$.ajax_url3
			if(e.id){
				this.id = e.id
				this.get_info()
			}
			// this.get_category()
		},
		methods: {
			kai(index,indexs,i){
			     console.log(index,indexs,i)
				if(i==1){
					this.spec[index].is_show=true;
				}else{
					this.spec[index].ch[indexs].is_show=true;
				}
				 
			},
			guan(index,indexs,i){
				if(i==1){
					this.spec[index].is_show=false;
				}else{
					this.spec[index].ch[indexs].is_show=false;
				}
			},
			submit(){
				if(this.value == ''){
					return this.$.ti_shi('请填写商品名称')
				}
				// if(this.fl_id == 0){
				// 	return this.$.ti_shi('请选择分类')
				// }
				if(this.fileList1.length == 0){
					return this.$.ti_shi('请上传商品图片')
				}
				if(this.spec.length == 0){
					return this.$.ti_shi('请添加商品规格')
				}
				// if(this.value1 == ''){
				// 	return this.$.ti_shi('请填写销售价格')
				// }
				// if(this.value3 == ''){
				// 	return this.$.ti_shi('请填写商品库存')
				// }
				if(this.is_on_sale == -1){
					return this.$.ti_shi('请选择商品状态')
				}
				if(this.fileList2.length == 0){
					return this.$.ti_shi('请上传商品详情')
				}
				
				var gallery_images = [];
				var details_content = [];
				this.fileList1.forEach((item,index)=>{
					gallery_images.push(item.url)
				})
				this.fileList2.forEach((item,index)=>{
					details_content.push(item.url)
				})
				var p = {
					id:this.id,
					name:this.value,
					// category_id:this.fl_id,
					gallery_images:gallery_images.join(','),
					specification:this.spec,
					retail_price:this.value1,
					stock:this.value3,
					is_on_sale:this.is_on_sale,
					// is_seven_days:this.is_seven_days,
					details_content:details_content.join(',')
				}
				if(this.is_submit == 0){
					this.is_submit = 1;
					let url = 'store/product/add_hddc';
					if(this.id){
						url = 'store/product/edit_hddc';
					}
					this.$.ajax(1,'post',url,p,(res)=>{
						this.$.ti_shi(res.msg)
						if(res.code == 200){
							setTimeout(()=>{
								this.$.back()
							},600)
						}else{
							this.is_submit = 0;
						}
					});
				}
			},
			spec_er_del(){
				this.spec[this.yi_index].ch.splice(this.er_index, 1)
				this.yi_index = -1;
				this.er_index = -1;
				this.scer_show = false
			},
			spec_er_edit(){
				if(this.er_item.name == ''){
					return this.$.ti_shi('请填写规格名称')
				}
				this.er_item = {};
				this.er_index = -1;
				this.er_edit_show = false
			},
			spec_del(){
				this.spec.splice(this.yi_index, 1)
				this.yi_index = -1;
				this.sc_show = false
			},
			spec_edit(){
				if(this.yi_item.name == ''){
					return this.$.ti_shi('请填写规格名称')
				}
				this.yi_item = {};
				this.yi_index = -1;
				this.yi_edit_show = false
			},
			spec_sub(){
				if(this.tcvalue == ''){
					return this.$.ti_shi('请填写规格名称')
				}
				let tem = {
					is_show:false,
					name:this.tcvalue,
					ch:[]
				};
				this.spec.push(tem)
				this.tcvalue = ''
				this.show = false
			},
			spec_er_sub(){
				if(this.valueer == ''){
					return this.$.ti_shi('请填写二级规格名称')
				}
				if(this.valueer1 == ''){
					return this.$.ti_shi('请填写销售价格')
				}
				if(this.valueer2 == ''){
					return this.$.ti_shi('请填写商品库存')
				}
				// if(this.Image == ''){
				// 	return this.$.ti_shi('请上传规格图片')
				// }
				let tem = {
					is_show:false,
					specification:this.valueer,
					num:this.valueer1,
					money:this.valueer2,
					pic_image:this.Image,
				};
				this.spec[this.yi_index].ch.push(tem)
				this.yi_index = -1;
				this.valueer = ''
				this.valueer1 = ''
				this.valueer2 = ''
				this.Image = ''
				this.img_show = true
				this.ershow = false
			},
			
			get_info(){
				this.$.ajax(1,'post','store/product/edit_hddc_hx',{
					id:this.id,
				},(res)=>{
					if(res.code == 200){
						this.info = res.data
						this.value = res.data.name
						this.value1 = res.data.retail_price
						this.value3 = res.data.stock
						this.zt_name = res.data.is_on_sale == 1 ? '上架' : '下架';
						this.is_on_sale = res.data.is_on_sale;
						// this.is_seven_days = res.data.is_seven_days
						// this.checked = res.data.is_seven_days == 1 ? true : false;
						// this.fl_id = res.data.category_id;
						// this.fl_name = res.data.category_title
						res.data.gallery_images.forEach((item,index)=>{
							this.fileList1.push({
								url:item
							})
						})
						res.data.details_content.forEach((item,index)=>{
							this.fileList2.push({
								url:item
							})
						})
						this.spec = res.data.specification
					}else{
						this.$.ti_shi(res.msg)
					}
				});
			},
			get_category(){
				this.$.ajax(1,'post','store/product/store_category',{},(res)=>{
					if(res.code == 200){
						this.columns = [res.data]
					}else{
						this.$.ti_shi(res.msg)
					}
				});
			},
			
			yi_tianjia(index) {
				this.yi_index = index;
				this.ershow = true
				this.valueer = ''
				this.valueer1 = ''
				this.valueer2 = ''
				this.Image = ''
			},
			yi_bianji(item,index) {
				console.log(item)
				this.yi_item = item;
				this.yi_index = index;
				this.yi_edit_show = true
			},
			yi_del(index) {
				this.yi_index = index;
				this.sc_show = true
			},
			yi_edit_close() {
				this.yi_item = {};
				this.yi_index = -1;
				this.yi_edit_show = false
			},
			
			er_bianji(item,index) {
				this.er_item = item;
				this.er_index = index;
				this.er_edit_show = true
				this.img_show = false
				this.Image = item.pic_image
			},
			er_dianji(item) {
				this.er_item = item;
				item.is_show = !item.is_show
			},
			er_del(index,indexs) {
				this.yi_index = index;
				this.er_index = indexs;
				this.scer_show = true
			},
			
			
			
			
			
			
			
			
			
			
			
			
			
			
			cancel(){
				this.fl_show = false
			},
			confirm(n){
				this.fl_name = n.value[0].name
				this.fl_id = n.value[0].id
				this.fl_show = false
			},
			zt_cancel(){
				this.fl_show = false
			},
			zt_confirm(n){
				this.zt_name = n.value[0].name
				this.is_on_sale = n.value[0].value
				this.zt_show = false
			},
			
			
			
			
			
			
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: this.$.ajax_url+"/common/upload", // 仅为示例，非真实的接口地址
						filePath: url,
						name: 'file',
						formData: {
							user: 'test'
						},
						success: (res) => {
							let data = JSON.parse(res.data)
							setTimeout(() => {
								resolve(data.data.url)
							}, 1000)
						}
					});
				})
			},
			
			
			
			
			close() {
				this.show = false
				// console.log('close');
			},
			sc_close() {
				this.sc_show = false
				// console.log('close');
			},
			erclose() {
				this.ershow = false
				this.er_edit_show = false
				// console.log('close');
			},
			scer_close() {
				this.scer_show = false
			},
			addImg() {
				this.$.add_img(1,(res)=>{
					if(res.code == 1){
						this.Image = res.data.fullurl
						this.img_show = false
					}else{
						this.$.ti_shi(res.msg)
					}
				})
			},
			delet() {
				this.Urlimg = ''
				this.is_show = true
			},
			checkboxChange(n) {
				console.log('change', n);
				if(n){
					this.is_seven_days = 1
				}else{
					this.is_seven_days = 0
				}
			},
			diana() {
				this.one_show = !this.one_show
			},
			dianb() {
				this.two_show = !this.two_show
			},
			tianjia() {
				this.ershow = true
				this.valueer = ''
				this.valueer1 = ''
				this.valueer2 = ''
			},
			bianji() {
				this.show = true
				this.tcvalue = this.oneName
			},
			dianji() {
				this.ershow = true
				this.valueer = this.twoNameL
				this.valueer1 = this.jiage
				this.valueer2 = this.guige
			}
		}
	}
</script>

<style lang="scss">
	.back {
		padding: 32rpx 24rpx;
	}

	.list {
		margin-top: 200rpx;
		padding: 0 32rpx;
	}

	.list_bo {
		width: 478rpx;
		border-bottom: 2rpx solid #F7FAFF;
		padding-bottom: 10rpx;
		margin-top: 14rpx;


	}

	.list_b_bo {
		width: 140rpx;
		height: 140rpx;
		position: relative;
	}

	.bo_img {
		width: 32rpx;
		height: 32rpx;
		position: absolute;
		right: -14rpx;
		top: -14rpx;
	}

	.bor_bot {
		margin-bottom: 40rpx;
	}

	.r_img {
		width: 32rpx;
		height: 32rpx;
	}

	.list_b {
		/* margin-left: 48rpx; */
		width: 478rpx;
	}

	.b_add {
		width: 140rpx;
		height: 140rpx;
	}

	.b_add_img {
		position: relative;
		width: 140rpx;
		height: 140rpx;
		margin-bottom: 16rpx;
	}

	.shanchu {

		position: absolute;
		top: -16rpx;
		right: -16rpx;
	}

	.b_img {
		width: 140rpx;
		height: 140rpx;
		border-radius: 16rpx;
		/* margin-bottom: 16rpx; */
	}

	.delet {
		width: 32rpx;
		height: 32rpx;
	}

	.add_one {
		width: 638rpx;
		background-color: #3377FF;
		border-radius: 16rpx;
		margin-bottom: 24rpx;

		.yiji {
			width: 590rpx;
			padding: 24rpx;

		}

		.erji {
			width: 590rpx;
			padding: 24rpx;
			background-color: #71A0FF;
			// opacity: 0.7;
		}

		.er_zk {}

		.er_list {
			width: 590rpx;
			// height: 356rpx;
			background: #F7FAFF;
			padding: 32rpx 24rpx;
		}

		.er_img {
			width: 140rpx;
			height: 140rpx;
		}
	}
	.add_one:last-child{
		margin-bottom: 0;
	}

	.tc {
		padding: 40rpx 32rpx;

		.tc_input {
			width: 574rpx;
			height: 44rpx;
			background: #F7F7F7;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			padding: 24rpx;
		}

		.but_a {
			width: 298rpx;
			height: 100rpx;
			background: #F7F7F7;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			text-align: center;
			line-height: 100rpx;
		}

		.but_b {
			width: 298rpx;
			height: 100rpx;
			background: #3377FF;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			text-align: center;
			line-height: 100rpx;
		}
	}

	.but_img {
		width: 252rpx;
	}

	.but_img2 {
		width: 176rpx;
	}

	.is_img {
		width: 36rpx;
		height: 36rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		// border: 3rpx solid #FFFFFF;
	}

	.addimg {
		width: 140rpx;
		height: 140rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
	}
</style>